<template>
    <div>
        <h1>房号更新</h1>
        <table class="table">
            <tr>
                <td>房号</td>
                <td><input type="text" v-model="data.nnumber"></td>
            </tr>
            <tr>
                <td>状态</td>
                <td>
                    <select v-model="data.stateId">
                        <option value="0">请选择</option>
                        <option v-for="d in xl" :value="d.stateId">{{d.sname}}</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>联系人手机号</td>
                <td><input type="text" v-model="data.nphone"></td>
            </tr>
            <tr>
                <td>联系人名</td>
                <td><input type="text" v-model="data.nname"></td>
            </tr>
            <tr>
                <td>房型类型</td>
                <td>
                    <select v-model="data.roomId">
                        <option value="0">请选择</option>
                        <option v-for="s in xls" :value="s.roomId">{{s.rname}}</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>联系人头像</td>
                <td>
                    <input type="file" @change="sc">
                    <img :src="'https://localhost:7292/'+data.nimage" style="width: 60px;height: 60px;">
                </td>
            </tr>
            <tr>
                <td></td>
                <td><input type="button" value="更新" @click="update"></td>
            </tr>
            
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios'
import {ref,onMounted} from 'vue'
import {useRouter,useRoute} from 'vue-router'
const router=useRouter();
const route=useRoute();
const data=ref({
    "nid": 0,
  "nnumber": "",
  "stateId": 0,
  "nphone": "",
  "nname": "",
  "roomId": 0,
  "nimage": ""
})
const ft=()=>{
var f=route.query.id
axios.get("/api/Number/GetNumberById",{params:{id:f}}).then(res=>{
    data.value=res.data
})
}
const update=()=>{
    axios.put("/api/Number/UpdateNumber",data.value).then(res=>{
        if(res.data==-1){
            alert("房号不能一致")
            return;
        }
        else if(res.data>0){
            alert("更新成功")
            router.push({path:"/"})
        }
        else{
            alert("更新失败")
            return
        }
    })
}
onMounted(()=>{
    xlk()
    xlks()
    ft()
})
const xl=ref({})
const xlk=()=>{
    axios.get("/api/Number/GetState").then(res=>{
        xl.value=res.data
    })
}
const xls=ref({})
const xlks=()=>{
    axios.get("/api/Number/GetRoom").then(res=>{
        xls.value=res.data
    })
}
const sc=(e:any)=>{
    var f=e.target.files[0];
    var fd=new FormData();
    fd.append("file",f);
    axios.post("/api/Number/GetImg",fd).then(res=>{
        data.value.nimage=res.data
    })
}
</script>

<style scoped>

</style>